<template>
  <div class="common-panel">
    <div v-if="emptyVisible" class="no-data common-panel-empty">
      <span class="empty-text">{{ emptyText }}</span>
    </div>
    <template v-else>
      <slot name="header" />
      <div v-if="$slots.left || $slots.right" class="panel-header">
        <div class="left">
          <slot name="left" />
        </div>
        <div class="right">
          <slot name="right" />
        </div>
      </div>
      <div class="panel-body">
        <slot name="body" />
      </div>
      <div v-if="$slots.footer" class="panel-footer">
        <slot name="footer" />
      </div>
    </template>
  </div>
</template>

<script>
  export default {
    components: {},
    props: {
      emptyText: { type: String, default: '暂无数据' },
      emptyVisible: { type: Boolean, default: false },
    },
    data() {
      return {};
    },
    methods: {},
  };
</script>

<style lang="scss" scoped></style>
